<template>
  <div id="app">
    <router-view style="overflow:hidden" />

  </div>
</template>

<script>
  export default {
    name: "App",
    // metaInfo: {
    //     title: "桂花糖",
    //     meta: [
    //       { name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;' }
    //     ]
    // }
    data() {
      return {
        accessCount: 0,
      };
    },
  };
</script>

<style>
  /* *{ touch-action: manipulation;} */
  html,
  body {
    font-size: 62.5%;
    width: 100%;
    min-height: 100vh;
    touch-action: none;
    touch-action: pan-y;
  }

  *,
  *:after,
  *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  .clearfix:before,
  .clearfix:after {
    content: " ";
    display: table;
  }

  .clearfix:after {
    clear: both;
  }

  a:hover,
  a:focus {
    color: #74777b;
    text-decoration: none;
  }
  .clear{
   clear:both;
   display: block;
  }
  .left {
    float: left;
  }

  .right {
    float: right;
  }

  #app {
    width: 100%;
    min-height: 100vh;
    font-family: "Avenir", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    color: #2c3e50;
    /* margin-top: 60px; */
  }

.banner{
  width:100%;

}
.banner img{
  width:100%;

}


 #showInfo {
      width: 100%;

    }
#showInfo .commColor{
      display: flex;
      width: 100%;
      justify-content: space-around;
  }

  .mobile {
    display: none;
  }

  .pc {
    display: block;
    /* width:100%; */
    width: 100%;
    /* max-width: 1440px; */
    margin: 0px auto;
  }

  @media (max-width:500px) {
    .mobile {
      display: block;
      width: 100%;
    }

    .pc {
      display: none;
    }
  }

  .red {
    color: red;
  }

  .green {
    color: green;
  }
</style>
